<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="${BaseContext}">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
	<!-- 引入bootstrap -->
	<link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css">
	<!-- 引入JQuery  bootstrap.js-->
	<script src="static/js/jquery-3.2.1.min.js"></script>
	<script src="static/js/bootstrap.min.js"></script>
</head>
<body>

	<!-- 顶栏  -->
	<jsp:include page="include/top.jsp"></jsp:include>
	<div class="container" id="content">
		<div class="row">
			<!-- 菜单 -->
			<jsp:include page="include/menu.jsp"></jsp:include>
			<div class="col-md-10">
				<div class="row">
					<div class="panel panel-default">
					  <!-- Default panel contents -->
					  <div class="panel-heading">
					  	评估材料项
					  </div>
					  <div class="panel-body">
					  
					  <button type="button" class="btn btn-primary" id="modal-btn">添加材料项</button>
						
						<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
						  <div class="modal-dialog" role="document">
						    <div class="modal-content">
						      <div class="modal-header">
						        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
						        <h4 class="modal-title" id="exampleModalLabel">新的材料项</h4>
						      </div>
						      <div class="modal-body">
						      
						        <form id="materialForm" action="admin/updateMaterialTemplate.do" method="post">
						          <div class="form-group">
						            <label for="message-text" class="control-label">材料项名称：</label>
						            <input type="text" class="form-control" name="materialName" id="materialName">
						          </div>
						          <div class="form-group">
						            <label for="message-text" class="control-label">材料地址：</label>
						            <input type="text" disabled="disabled" class="form-control" name="materialRemark" id="materialRemark">
						          </div>
						        </form>
						      </div>
						      <div class="modal-footer">
						        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						        <button type="button" class="btn btn-primary" id="add-btn">添加</button>
						      </div>
						    </div>
						  </div>
						</div>
					  </div>
					
					  <!-- Table -->
					  <table class="table table-bordered">
					   	<thead>
					            <tr>
									<th>材料项名称</th>
									<th>操作</th>
					            </tr>
					        </thead>
					        <tbody>
					        	<c:forEach items="${dataList}" var="dataMap">
						        	<tr>
						        		<td>${dataMap.k}</td>
						        		<td>																			
						        			<button class="btn btn-default btn-xs btn-info" mtName="${dataMap.k}" mtRemark="${dataMap.v}" onClick="getOneTemplate(this)">修改</button>
											<button class="btn btn-default btn-xs btn-danger btn-primary" mtName="${dataMap.k}" mtRemark="${dataMap.v}" onClick="confirmd(this)">删除</button>
						        		</td>
						        	</tr>
					        	</c:forEach>
					        </tbody>
					  </table>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<!-- footer -->
	<jsp:include page="include/footer.jsp"></jsp:include>
<script type="text/javascript">
	$(function(){
		$("#nav li:nth-child(4)").addClass("active");
		//打开模态框，清空表单
		$('#modal-btn').on('click',function(){
			$('#materialName').val('');
			$('#materialRemark').val('');
			$('#exampleModal').modal('toggle');
		})
		//添加
		$('#add-btn').on('click',function(){
			$('#materialForm').submit();
		})
	});
	//修改数据
	function getOneTemplate(obj){
		var mtName = $(obj).attr('mtName');
		var mtRemark = $(obj).attr('mtRemark');
		//alert(mtName);
		$('#materialName').val(mtName);
		$('#materialRemark').val(mtRemark);
		$('#exampleModal').modal('toggle');
	}
	//删除
	function confirmd(obj){
		var mtName = $(obj).attr('mtName');
		var mtRemark = $(obj).attr('mtRemark');
		$.post('admin/deleteMaterialTemplate.do',{'materialName':mtName,'materialRemark':mtRemark},function(data){
			if(data.success){
				$(obj).parent().parent().remove();
			}
		},'json');
	}
</script>
</body>
</html>